.icon {
   width: 1em; height: 1em;
   vertical-align: -0.15em;
   fill: currentColor;
   overflow: hidden;
}
@mixin aa($w,$h){
    width: $w;
    height: $h;
}
.header{
    @include aa(100%,1rem);
    .logo{
        float: left;
        margin-top: .16rem;
        margin-left: .18rem;
        margin-bottom: .16rem;
        
        @include aa(2.18rem,.68rem);
        background: url(../img/logo.png) ;
        background-size: 100% 100%;
    }
    .right-header{
        float: right;
        font-size: .2rem;
        display: flex;
        .woDe{
            @include aa(.44rem,.68rem);
            padding: .18rem .16rem;
            a{
                .user{
                   @include aa(.43rem,.43rem); 
                   margin-top: -.05rem; 
                }
                p{
                    font-size: .22rem;
                    margin-top: .05rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
            }
        }
        .daoHang{
            @include aa(.44rem,.68rem);
            padding: .18rem .16rem;
            a{
                .nav{
                   @include aa(.43rem,.43rem);
                   margin-top: -.05rem; 
                }
                p{
                    font-size: .22rem;
                    margin-top: .05rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
            }
        }
    }
}
.tian{
    @include aa(100%,2.55rem);
    img{
       @include aa(100%,100%); 
    }
}
.zhengWen{
    font-size: .2rem;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
    @include aa(7.5rem,2.08rem);
    border-bottom: 1px solid #F4F4F4;
    .hui{
        display: flex;
//      justify-content: center;
        align-items: center;
        @include aa(7.14rem,.45rem);
            background: #f4f4f4; 
        p{
            font-size: .24rem;
        }
    }
    p:nth-child(2){
        font-size: .36rem;
    }
    p:nth-child(3){
        display: flex;
        
        .line{
            @include aa(.28rem,.28rem);
            margin-right: .1rem;
        }
        span{
            font-size:.24rem;
            margin-right: .5rem;
        }
    }
}
.keting{
     @include aa(7.5rem,1.35rem);
     li{
         float: left;
         width:auto ;
         height: .32rem;
         margin-right: .12rem;
         border: 1px solid;
         font-size: .24rem;
         border-radius:.32rem ;
         line-height: .32rem ;
         margin-top: .18rem;
         padding: {
             left: 0.1rem;
             right:0.1rem ;
         };
     }
}
.sen{
    @include aa(100%,3.52rem);
    display: flex;
    justify-content: center;
    img{
       @include aa(5.28rem,3.52rem); 
    }
}
.dianJi{
    @include aa(7.14rem,.7rem); 
    font-size: .24rem;
    color: #39C893;
    border: 1px solid #39C893;
    border-radius: .05rem;
    text-align: center;
    line-height: .7rem;
    margin-left: .17rem;
    margin-top: .5rem;
}
.ping{
    font-size: 0.2rem;
    @include aa(5.5rem,2.2rem);
    text-align: center;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding-left: 1rem;
    padding-right: 1rem;
    li{
        width: 1.06rem;
        height: 1.5rem;
        a{
            width: 1.06rem;
            height: 1.5rem;
            display: block;
            display: flex;
            justify-content: space-between;
            flex-direction: column;
           div{
                @include aa(1rem,1rem);
                border-radius: 50%;
                border: .03rem solid #1b9bf7;
                display: flex;
                justify-content: center;
                align-items: center;
                
                .share{
                    @include aa(.58rem,.58rem);
                }
                .pencle{
                    color: #1b9bf7;
                    @include aa(.58rem,.58rem);
                }
            } 
        }
        
    }
}
.gong{
    .she{
        @include aa(100%,1rem);
        display: flex;
        .green{
            @include aa(.05rem,.42rem);
            margin-left: .17rem;
            margin-top: .32rem;
            background: #37c993;
        }
        p:nth-child(2){
            margin-left: .12rem;
            margin-top: .35rem;
            font-size: .36rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
    }
    .fang{
        font-size: 0.2rem;
        li{
            @include aa(100%,1.75rem);
            display: flex;
            justify-content: space-around;
            .fangZuo{
                margin-left: .2rem;
                @include aa(1.9rem,1.45rem); 
                img{
                   @include aa(100%,100%);
                }
            }
            .fangYou{
                @include aa(4.88rem,1.44rem);
                display: flex;
                justify-content: space-between;
                flex-direction: column;
                p:nth-child(1){
                    font-size: 0.36rem;
                    margin-left: 0.2rem;
                    width: 4.97rem;
                }
                p:nth-child(2){
//                  margin-left: .18rem;
                    margin-top: .2rem;
                    margin-left: .22rem;
                    font-size: 0.28rem;
                    .time{
                        @include aa(0.3rem,0.3rem); 
                        margin-right: .12rem;
                    }
                    span{
                        font-size: .28rem;
                        color: #999;
                        
                    }
                    .view{
                        margin-right: .12rem;
                        @include aa(0.3rem,0.3rem);
                    }
                }
            }
        }
    }
    .huan{
        @include aa(7.17rem,0.7rem);
        font-size: 0.2rem;
        display: flex;
        margin-left: 0.18rem;
        margin-top: 0.3rem;
        margin-bottom: 0.3rem;
        border-radius: .05rem;
        
        li:nth-child(1){
            border: 1px solid #f4f4f4;
            
            @include aa(50%,0.68rem);
            a{
                display: block;
                @include aa(100%,100%);
                display: flex;
                justify-content: center;
                align-items: center;
                p{
                    font-size: .28rem;
                    color: #39c893;
                }
                .change{
                    color: #39c893;
                    @include aa(0.28rem,0.28rem);
                }
            }
        }
        li:nth-child(2){
            border: 1px solid #f4f4f4;
            @include aa(50%,0.68rem);
            a{
                display: block;
                @include aa(100%,100%);
                display: flex;
                justify-content: center;
                align-items: center;
                p{
                   font-size: .28rem;
                   color: #39c893;
                }
                .more{
                    color: #39c893;
                    @include aa(0.28rem,0.28rem);
                }
            }
        }
    }
}
.zi{
    border-bottom: .17rem solid #f4f4f4;
    border-top: .17rem solid #f4f4f4;
    @include aa(7.18rem,2rem);
    display: flex;
    padding:.36rem .18rem ;
    font-size: .28rem;
    text-indent: 0.56rem;
    line-height: 0.52rem;
}
.fu{
// @include aa(100%,1.3rem);
   .fuUp{
       @include aa(100%,1.4rem);
       display: flex;
       justify-content: center;
       align-items: center;
       .hot{
          @include aa(.32rem,.32rem); 
       }
       p{
           font-size: .28rem;
       }
   }
   .fuDown{
       display: flex;
       text-align: center;
       li{
          @include aa(25%,.26rem); 
          font-size: .26rem; 
       }
   }
}
.dada{
    @include aa(100%,1.45rem);
    img{
        @include aa(100%,100%);
    }
}
